<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="apple-wap-web-app-capable" content="yes">
    <meta name="apple-wap-web-app-status-bar-style" content="black-translucent">
    <meta name="MobileOptimized" content="240"/>
    <title>战队报名</title>
    <link rel="stylesheet" href="$!webPath/css/reset.css" />
    <link rel="stylesheet" href="$!webPath/css/style.css" />
    <link rel="stylesheet" href="$!webPath/css/style_my.css" />
    <script type="text/javascript" src="$!webPath/js/jquery.min.js" ></script>
    <script src="$!webPath/js/jquery.form1.js"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <!--<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>-->

</head>
<body style="background-color:#fff">
<div class="all">
    <div class="teamTop">
        <div class="teamAvatar">
            <form method="post" name="theForm" id="theForm"  enctype="multipart/form-data">
                <div>
                    #if($!teamEntity.logoPath)
                    <img id="teamImg" src="$!webPath$!teamEntity.logoPath" onclick="imgUpdate()" height="180" width="100%">
                    #else
                    <img id="teamImg" src="$!webPath/imgs/member.jpg" onclick="imgUpdate()" height="180" width="100%">
                    #end
                    <input type="file" name="photo" id="fileImg" style="width: 70px;display: none;">
                    <input type="hidden" name="teamId" value="$!teamEntity.id"/>
                    <input type="button" id="btn_update" class="btn_imgupdate" style="display: none;" value="修改"/>
                </div>
            </form>
        </div>
        <div class="teamName">
            <div>$!teamEntity.name</div>
            <div><span class="grey">积分排位赛总积分</span> $!teamEntity.teamIntegral <span class="grey">排名</span> 无</div>
            <div><span class="grey">战队成员</span> $!teamMember.size()/7 $!teamEntity.location</div>
        </div>
    </div>
    <div class="teamList">
        #foreach($obj in $!teamMember)
        <div class="teamListbox">
            <div class="tLAvatar">
                #if($!obj.userLocalPicPath)
                <img src="$!obj.userLocalPicPath" width="100%">
                #elseif($!obj.userWxPicPath)
                <img src="$!obj.userWxPicPath" width="100%">
                #else
                <img src="$!webPath/imgs/member.jpg" width="100%">
                #end
            </div>
            <div class="tLName">
                #if($!obj.nickname)
                $!obj.nickname
                #else
                $!obj.userWxNickname
                #end
            </div>
            <div class="tLPhone">
                #if($!obj.mobile)
                $!obj.mobile
                #else
                暂无手机
                #end
            </div>
            <div class="tLBtn">
                #if($!teamEntity.teamStatus!=2)
                #if($!teamEntity.isLocked == 0)
                    #if($!userEntity.isCaption == 1)
                        #if($!obj.isCaption==1)
                            <div onclick="dismiss(event,'$!obj.id')">解散</div>
                        #else
                            <div onclick="dismiss(event,'$!obj.id')">踢出</div>
                        #end
                    #else
                        #if($!obj.id == $!userEntity.id)
                        <div onclick="dismiss(event,'$!obj.id')">离队</div>
                        #else
                            #if($!obj.isCaption==1)

                            #end
                        #end
                    #end
                #end
                #end
            </div>
        </div>
        #end
        #if($!teamEntity.teamStatus!=2)
        <div class="teamAdd" id="oB">
            +添加好友
        </div>
        #end
    </div>
    <div class="teamFooter">
        #if($!teamEntity.teamStatus!=2)
        #if($!userEntity.isCaption == 1 && $!teamMember.size()==7)
        <a href="$!webPath/article/proteam_rule?teamId=$!teamEntity.id" class="btnB">转职业战队</a>
        #else
        <a href="javascript:void(0)" class="btnG">转职业战队</a>
        #end
        #else
        <a href="javascript:void(0)" class="btnG"></a>
        #end
        #if($!userEntity.isCaption == 1 && $!teamMember.size()>=5 && $!teamEntity.isLocked == 0)
        <a href="javascript:void(0)" onclick="teamComplete(1)" class="btnY">完成组队</a>
        #elseif($!userEntity.isCaption == 1 && $!teamEntity.isLocked == 1)
        <a href="javascript:void(0)" onclick="teamComplete(0)" class="btnY">解锁队伍</a>
        #else
        <a href="javascript:void(0)" class="btnG">完成组队</a>
        #end
    </div>
</div>
#if($!userEntity.nickname)
#set($decri =$!userEntity.nickname)
#else
#set($decri = $!userEntity.userWxNickname)
#end
$!decri
</body>
<script>
    $(function(){
        var mar_height=$('.teamFooter').css('height');
        $('.teamList').css('margin-bottom',mar_height);
    })
    function imgUpdate() {
        $('#fileImg').css('display','block');
        $('#btn_update').css('display','block');
    }

    $('#fileImg').change(function(){
        var $file = $(this);
        var fileObj = $file[0];
        var windowURL = window.URL || window.webkitURL;
        var dataURL;
        var $img = $("#teamImg");

        if (fileObj && fileObj.files && fileObj.files[0]) {
            dataURL = windowURL.createObjectURL(fileObj.files[0]);
            $img.attr('src', dataURL);
        } else {
//            dataURL = $file.val();
//            var imgObj = document.getElementById("preview");
            // 两个坑:
            // 1、在设置filter属性时，元素必须已经存在在DOM树中，动态创建的Node，也需要在设置属性前加入到DOM中，先设置属性在加入，无效；
            // 2、src属性需要像下面的方式添加，上面的两种方式添加，无效；
//            imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
//            imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL;
            alert('不支持图片格式');
        }
    })
    $('#btn_update').click(function () {
        if('$!userEntity.isCaption'!=1){
            return false;
        }else{
            $("#theForm").ajaxSubmit({
                url : "$!webPath/team/uploadTeamLogo",
                type : "post",
                success : function(data) {
                    $('#fileImg').css('display','none');
                    $('#btn_update').css('display','none');
                    window.location.reload();
                },
                error : function(data) {
                    alert('失败');
                }
            });
        }

    })
    function dismiss(e,userId){
        var str= e.target.innerText;
        if(confirm('确定'+str+'战队吗')) {
            jQuery.ajax({
                type: "POST",
                url: "$!webPath/team/dismissTeam",
                data: {teamId: "$!teamEntity.id", userId: userId},
                success: function (data) {
                    if (data.data == "success") {
                        window.location.reload();
                    }
                }
            })
        }
    }
    function teamComplete(status){
        jQuery.ajax({
            type: "POST",
            url: "$!webPath/team/modify_status",
            data: {teamId:"$!teamEntity.id",status:status},
            success: function (data) {
                console.log();
                if (data.data == "success") {
                    if(status == 0){
                        jQuery(".btnY").hide();
                        jQuery(".teamFooter").append("<a href='javascript:void(0)' onclick='teamComplete(1)' class='btnY'>完成组队</a>")
                    }else{
                        jQuery(".btnY").hide();
                        jQuery(".teamFooter").append("<a href='javascript:void(0)' onclick='teamComplete(0)' class='btnY'>解锁队伍</a>")
                    }
                }
            }
        })

    }
    wx.config({
        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
        appId: '$!appId', // 必填，公众号的唯一标识
        timestamp: '$!timestamp', // 必填，生成签名的时间戳
        nonceStr: '$!nonceStr', // 必填，生成签名的随机串
        signature: '$!signature',// 必填，签名，见附录1
        jsApiList: ['onMenuShareAppMessage'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
    });

    $("#oB").click(function(){
        //encodeURIComponent(location.href.split('#')[0]);
        //alert('$!authorUrl');
        console.log('$!authorUrl');
        if(parseInt('$!teamMember.size()')==7){
            alert('您的战队已满员');
        }else{
            alert('分享好友请点击右上角的分享按钮');
        }
    })


    wx.ready(function () {

        var shareData = {//自定义分享数据

            title: '加入我的战队吧!',

            desc: "$!decri邀请你加入他的战队",

            //link: '$!authorUrl',//链接地址
            link: '$!webPath/team/teamTransform?teamId=$!teamEntity.id',
            imgUrl: '$!webPath/$!teamEntity.logoPath',
            type:'link',
            fail: function (res) {
                alert(JSON.stringify(res));
            }
        };

        wx.onMenuShareAppMessage(shareData);
    })

    wx.error(function(res){
        // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
        alert("errorMSG:"+res.errMsg);
        console.log(res);
    });

</script>
</html>